<div class="loading-box" ng-show=loaded>
    <div class="loader">
        <div class="loader-inner ball-clip-rotate-multiple">
            <div></div>
            <div></div>
        </div>
    </div>
</div>
<div>
    <form class="form-horizontal" name="frm" style="">
        <div class="panel panel-default">
            <div class="panel-heading">
                <span style="font-size: 16px; color: #5a6378">创建服务实例</span>
                <div style="float:right;margin-right:15px;" ng-if="saasname">
                    <a class="color-orange" href={{url}} target="_blank" style="color: #f8b551;cursor: pointer;">立刻申请</a>
                </div>
            </div>
            <div class="panel-body">
                <div class="row">
                    <div ng-if="saasname">
                        <label class="col-sm-2 control-label text-left" style="margin-top: 10px; color: #5a6378; font-size:14px; text-align: left; font-weight: normal">Saas服务名称</label>
                        <div class="col-sm-10" style="padding-right: 40px; ">
                            <input style="margin-top: 10px; width: 640px;" type="text" class="form-control" readonly ng-model="saasname"
                            >
                        </div>
                    </div>

                    <label class="col-sm-2 control-label text-left" style="margin-top: 10px; color: #5a6378; font-size:14px; text-align: left; font-weight: normal">实例名称</label>
                    <div class="col-sm-10" style="padding-right: 40px; ">
                        <input style="margin-top: 10px; width: 640px;" type="text" name="name" class="form-control"
                               ng-blur="nameblur()"
                               onkeypress="if((event.keyCode > 31 && event.keyCode < 44) || (event.keyCode > 46 && event.keyCode < 48) || (event.keyCode > 57 && event.keyCode < 65) || (event.keyCode > 90 && event.keyCode < 97))event.returnValue = false;"
                               ng-focus="namefocus()"
                               ng-model="secrets.metadata.name"
                               placeholder="创建一个服务实例名称">
                        <small ng-if="namerr.nil" class="fa fa-info-circle err-tip">请输入正确构建名称
                        </small>
                        <small ng-if="namerr.rexed" class="fa fa-info-circle err-tip">请输入4~30位名称,名称只能包含英文、数字以及“-”
                        </small>
                        <small ng-if="namerr.repeated" class="fa fa-info-circle err-tip">输入的名称已重复
                        </small>
                    </div>
                </div>
                <hr>
                <div class="row" style="margin-top: 18px">
                    <label class="col-sm-2 control-label text-left" style="margin-top: 10px; color: #5a6378; font-size:14px; text-align: left; font-weight: normal">环境变量</label>
                    <div class="col-md-10" style="margin-top: 16px">
                        <a href="javascript:;" ng-click="addSecret()">
                            <i class="fa fa-plus-circle fa-green fa-lg"></i>
                            <span class="font12" style="color:#5b73e8">添加环境变量&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                <small ng-if="grid.keybuhefa" class="err-tip"><i class="fa fa-info-circle"></i>&nbsp;key值不合法</small>
                                <small ng-if="grid.keychongfu" class="err-tip"><i class="fa fa-info-circle"></i>&nbsp;key值重复</small>
                                <!--<small ng-if="grid.keynull" class="err-tip"><i class="fa fa-info-circle"></i>&nbsp;key值或value值为空</small>-->
                            </span>
                        </a>
                        <div class="secretitem row" style="margin-top: 20px; margin-bottom: 20px">
                            <div class="col-md-12" style="margin-bottom: 20px;padding: 0;"
                                 ng-repeat="item in secrets.secretsarr">
                                <input class="col-md-5 key create_jia_input" type="text" placeholder="KEY" ng-model="item.key" style="margin-left:14px;background:none;border:1px solid #c9c9c9">
                                <div class="col-md-1" style="width:2%;"></div>
                                <input class="col-md-5 key create_jia_input" type="text" placeholder="VALUE" ng-model="item.value" style="background:none;border:1px solid #c9c9c9">
                                <!--<textarea class="col-md-5 key" style="padding: 0;" type="text" placeholder="VALUE" ng-model="item.value"></textarea>-->
                                <a class="fa fa-times-circle col-md-1" ng-click="rmsecret($index)"
                                   style="text-decoration: none;text-align: center;line-height: 34px; color: #9fa7b7;" href="javascript:;"></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <a href="javascript:;" ng-if="grid.secreteno" class="btn btn-block create btn-orange" style="margin-top: 35px; color: white;" ng-click="postsecret()">创建</a>
        <a href="javascript:;" ng-if="!grid.secreteno" disabled="disabled" class="btn btn-block create" style="background-color: #ccc; margin-top: 35px; color: white; ">创建</a>

    </form>
</div>
<style>
    .key {
        height: 34px;
        line-height: 34px;
        padding: 6px 12px;
        font-size: 14px;
    }
    .create_jia_input{background: none;border:1px solid #c9c9c9;}
</style>
